<template>
  <div></div>
</template>

<script setup>
import { ref } from 'vue';

const metric = ref(0);
const metricUnit = ref(1);

const imperial = ref(0);
const imperialUnit = ref(1);

function metricToImperial() {
  // metric to centimeter than to inch
  const inchNum = Number(((metric.value * metricUnit.value) / 2.54).toFixed(2));
  imperial.value = Number((inchNum / imperialUnit.value).toFixed(2));
}

function imperialToMetric() {
  // imperial to inch than to centimeter
  const centimeterNum = Number(
    imperial.value * imperialUnit.value * 2.54
  ).toFixed(2);
  metric.value = Number((centimeterNum / metricUnit.value).toFixed(2));
}
</script>
